<template>
	<view class="wrap">
		<view class="topSearch u-flex">
			<view class="dateTime">
				<text>测试人员：</text>
				<input v-model="userName" disabled @click="nameShow=true"/>
        <text>问卷类型：</text>
				<input v-model="questionType" disabled @click="typeShow=true"/>
				<u-button style="margin-left:10rpx;" type="primary" size="mini">确认</u-button>
			</view>
		</view>
    <view class="questionMode">
      <view class="questionType">单选题</view>
      <view class="item">
        <view class="title">1.灭火的方式有哪些？</view>
        <view class="options">
          <view class="option">
            <input class="checkbox" type="radio" name="id11"/>
            <text class="text">灭火器</text>
          </view>
          <view class="option">
            <input class="checkbox" type="radio" name="id11"/>
            <text class="text">使用水灭火</text>
          </view>
          <view class="option">
            <input class="checkbox" type="radio" name="id11"/>
            <text class="text">使用泥土石灰</text>
          </view>
          <view class="option">
            <input class="checkbox" type="radio" name="id11"/>
            <text class="text">使用泥土石灰</text>
          </view>
        </view>
      </view>
      <view class="questionType">问答题</view>
      <view class="item">
        <view class="title">1.灭火的方式有哪些？</view>
        <view class="textArea">
          <textArea placeholder="请输入答案"></textArea>
        </view>
      </view>
    </view>
		<u-picker mode="time" v-model="timerShow" :params="params" @confirm="timerConfirm"></u-picker>
    <u-select mode="single-column" :list="nameList" v-model="nameShow" @confirm="selectConfirm('type')"></u-select>
    <u-select mode="single-column" :list="typeList" v-model="typeShow" @confirm="selectConfirm('name')"></u-select>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				userName:"",
        questionType:"",
				timerShow:false,
        typeList:['心里健康','身体健康'],
        typeShow:false,
        nameList:['张珊','刘伟','蒙古路'],
        nameShow:false,
				params:{
					year: true,
					month: true,
					day: true,
				}
			}
		},
		methods:{
			addPage(url){
				this.$u.route({
					url: url
				});
			},
      selectConfirm(e){

      },
			timerConfirm(e){
				
				this.myDate = `${e.year}-${e.month}-${e.day}`
			}
		}
	}
</script>

<style lang="scss" scoped>
.topSearch{
	padding:20rpx;
	.dateTime{
		line-height: 56rpx;
		font-size:22rpx;
		text{
			float:left;
		}
		input{
			font-size:22rpx;
			float:left;
			width: 200rpx;
			height:56rpx;
			line-height: 56rpx;
			padding:0 10rpx;
			border:1px solid #d9d9d9;
			border-radius:0.3em;
		}
	}
}

</style>
